<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>隐藏手机号中间四位案例.</title>
  <style>
    .wrapper {
      width: 840px;
      height: 420px;
      background: url(./images/bg01.jpg) no-repeat center / cover;
      padding: 100px 250px;
      box-sizing: border-box;
    }

    .wrapper strong {
      font-size: 50px;
    }

    .wrapper span {
      color: #b10e0d;
    }
  </style>
</head>

<body>
  <div class="wrapper">
    <strong>年会抽奖</strong>
    <h1>获奖手机号：<span class="phone">???</span></h1>
  </div>

  <script>
    // 隐藏手机号中间四位案例
    // const tel = '13611112222'

    // 1. 利用正则划分手机号

    // 2. 利用replace 替换
    // $1 可以得到正则中第一个小括号里面的内容
    // $2 可以得到正则中第二个小括号里面的内容

    // 3. 新需求： 只显示后面四位手机号  字符串重复 repeat方法

    // 字符串方法
    //  1. trim()
    //  2. replace 替换
    //  3. repeat 方法  字符串重复


    // 需求：把所有手机号 中间四位  ****
    const str = `
       我的手机号是：18511241111，
       我的女朋友的手机号是：13211111111，
       我的前女友的手机号是：18522223333，
       我的前前女友的手机号是：18511112293
    `;

    console.log(str.replace(/(\d{3})\d{4}(\d{4})/g, '$1****$2'))






    // 拓展案例   替换 为 04/01/2023
    let timeStr = '2023-04-01'    // $1 $2

    console.log(timeStr.replace(/(\d{4})-(\d{2})-(\d{2})/, '$2/$3/$1'))
  </script>
</body>

</html>